<template>
    <section class="content">
        <ul>
            <li style="display: flex;flex-direction:column;"><span>现场照片:</span>
                <p></p>
            </li>
        </ul>
        <ul>
            <li>
                <mu-col span="12" lg="4" sm="6">
                    <mu-select label="抄送人" v-model="select" full-width>
                        <mu-option v-for="option,index in options" :key="option" :label="option" :value="option"></mu-option>
                    </mu-select>
                </mu-col>
            </li>
            <li><span>检查人签字</span><span style="color:#C9C9C9;">请签字 ></span></li>
        </ul>
        <ul>
            <li style="display:flex;justify-content:space-around;">
                <mu-button>保存</mu-button>
                <mu-button color="primary">提交</mu-button>
            </li>
        </ul>
    </section>
</template>

<script>
    export default {
        name: "Checklist",
        data () {
            return{
                options: [
                    'Option 1', 'Option 2', 'Option 3', 'Option 4',
                    'Option 5', 'Option 6', 'Option 7', 'Option 8',
                    'Option 9', 'Option 10'
                ],
                select: '',
            }
        }
    }
</script>

<style scoped lang="scss">
    .content {
        padding: 0.1rem 0;
        .con {
            display: flex;
            flex-direction: column;
            padding: 0.1rem;
            ul {
                background: white;
                width: 100%;
                height: 100%;
                list-style: none;
                padding: 0.12rem;
                margin: 0.01rem 0;
                overflow: hidden;
                font-size: 0.12rem;
                li {
                    display: flex;
                    justify-content: space-between;
                    padding: 0.1rem 0;
                }
            }
        }
    }
</style>
